<template>
  <a-drawer v-model:visible="LAYER.visible" :title="LAYER.title" :width="LAYER.width"
            :closable="LAYER.closable" :mask-closable="LAYER.maskClosable" :esc-to-close="LAYER.escToClose"
            :unmount-on-close="LAYER.unmountOnClose" :footer="LAYER.footer" :ok-text="LAYER.okText"
            :ok-loading="LAYER.okLoading" :cancel-text="LAYER.cancelText" :on-before-ok="onSubmit" @close="onCancel">

    <!--表单开始-->

    <a-form ref="formRef" :model="formState" layout="vertical" :rules="RULES">
      <a-row :gutter="12">
        <a-col :span="8">


          <a-form-item label="商品分类" field="kind.code" :rules="RULES.kind.code">
            <smart-dict v-model="formState.kind.code"   :url="UnionOptions.MallKindOptions" allow-clear placeholder="请填商品分类" />
            
          </a-form-item>
        </a-col>
        <a-col :span="16">
          <a-form-item label="商品标题" field="title">
            <a-input v-model="formState.title" allow-clear placeholder="请填写商品标题"/>
          </a-form-item>
        </a-col>


        <a-col :span="8">
          <a-form-item label="可用库存" field="stockTotal">
            <a-input-number v-model="formState.stockTotal" :min="0" allow-clear placeholder="请填写商品标题"/>
          </a-form-item>
        </a-col>

        <a-col :span="8">
          <a-form-item label="标准售价(金币)" field="stdPrice">
            <a-input-number v-model="formState.stdPrice" :min="1" allow-clear placeholder="请填写标准售价"/>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item label="折扣售价(金币)" field="disPrice">
            <a-input-number v-model="formState.disPrice" :min="1" allow-clear placeholder="请填写折扣售价"/>
          </a-form-item>
        </a-col>

        <a-col :span="24">
          <a-form-item label="上架状态" field="state">
            <smart-dict v-model="formState.state" is-radio   :url="DictOptions.MallGoodsState" allow-clear placeholder="上架状态" />

          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="商品主图" field="picture">
            <smart-upload-image v-model="formState.picture" :limit="1"/>
          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="商品详情" field="detail">
            <smart-rich-editor v-model="formState.detail"/>
          </a-form-item>
        </a-col>


      </a-row>


    </a-form>
    <!--表单结束-->
  </a-drawer>
</template>

<script lang="ts" setup>

import {EditDrawer} from '@/libs/core'
import {GOODS_EDIT} from "../resource/form";
import {UnionMallHttp} from '../resource/http'
import {DictOptions, UnionOptions} from "@/libs/options";

const {RULES, BODY} = GOODS_EDIT

const props = defineProps({record: {type: Object, required: true}})
const emit = defineEmits(['cancel'])
const {addGoods, updateGoods} = UnionMallHttp
const config = {tplRecord: BODY, rawRecord: props.record, rowKey: 'id', emit}

const service = new EditDrawer(config).setAddRequest(addGoods).setUpdateRequest(updateGoods)
const {formRef, formState, LAYER, isUpdate, onCancel, onSubmit} = service
LAYER.title = isUpdate ? '修改商品资料' : '新建商品资料'

</script>

